﻿body {
    color: black;
    background-color: white;
}

.clear {
    clear: both;
}

input[type="text"] {
    width: 200px;
    margin: 5px;
    background-color: lightgray;
}

input[type="number"] {
    width: 50px;
    margin: 5px;
    background-color: lightgray;
}

select {
    margin: 5px;
    background-color: lightgray;
}

input[readonly="readonly"] {
    background-color: beige;
}

#CharacterInfo label {
    float: left;
    padding: 10px 2px 0 0;
}

#CharacterInfo input,
#CharacterInfo select {
    margin-right: 25px;
}

#CharacterInfo #Alignment select:first-of-type {
    margin-right: 0;
}

#CharacterInfo div {
    float: left;
}

#StatsPanelLabels div {
    width: 75px;
}

#StatsPanel {
    margin: 25px 0 0 0;
    width: 400px;
    float: left;
}

#StatsPanel label {
    float: left;
    width: 50px;
}

#StatsPanel div {
    float: left;
}

#InitPanel {
    margin: 25px 0 0 0;
}

#InitPanel div {
    float: left;
}

#InitPanel label {
    padding-top: 10px;
    float: left;
}

#HealthContainer {
    margin: 25px 0 0 0;
    float: left;
    width: 350px;
}

#HealthContainer div {
    float: left;
}

#SpeedContainer {
    margin: 25px 0 0 0;
    float: left;
    width: 350px;
}

#SpeedContainer div,
#SpeedContainer > label {
    float: left;
}

@media screen and (-ms-view-state: fullscreen-landscape) {
}

@media screen and (-ms-view-state: filled) {
}

@media screen and (-ms-view-state: snapped) {
}

@media screen and (-ms-view-state: fullscreen-portrait) {
}
